<template>
	<view class="comment-list">
		<view class="comment-item" v-for="(item, index) in commentList" :key="index"
			>
			<view class="info">
				<!-- 显示用户头像 -->
				<image :src="item.buyerAvatar ? item.buyerAvatar : '/static/pic/user.png'" class="avatar" />
				<view class="user-info">
					<text>{{ item.buyerNickname }}</text>
					<text class="rating">评分：{{ item.buyerRating }} 分</text>
				</view>
			</view>
			<text class="content">{{ item.buyerContent }}</text>
			<view class="time">{{ item.createdAt }}</view>
		</view>
	</view>
</template>
<script setup>
	import {
		ref,
		onMounted
	} from 'vue'
	import {
		getSellerCommentsApi
	} from '@/api/comments.js'
	import {
		onLoad
	} from '@dcloudio/uni-app';

	// 获取评论列表
	const commentList = ref([])

	// 获取传递过来的 sellerId 参数
	const sellerId = ref(0)

	// onMounted(async () => {
	//   // 从页面的参数中获取卖家ID
	//   const options = getCurrentPages()[getCurrentPages().length - 1].options
	//   console.log("options", options)
	//   sellerId.value = options.sellerId

	//   console.log("sellerId", sellerId.value)
	//   // 根据 sellerId 获取评论
	//   const res = await getSellerCommentsApi(sellerId.value)
	//   if (res && res.code == 200) {
	//     console.log("评论列表", res.data)
	//     commentList.value = res.data
	//   }
	// })

	onLoad(async (options) => {
		sellerId.value = options.sellerId
		console.log(sellerId.value)
		let res = await getSellerCommentsApi(sellerId.value)
		if (res && res.code == 200) {
			console.log("评论列表", res.data)
			commentList.value = res.data
		}
	})
	// 点击商品跳转时
	const navigateToDetail = (item) => {
		uni.navigateTo({
			url: `/pages/detail/detail?goods=` + JSON.stringify(item)
		})
	}
</script>


<style scoped>
	.comment-list {
		padding: 20rpx;
		background-color: #f7f7f7;
	}

	.comment-item {
		background: #fff;
		border-radius: 12rpx;
		padding: 20rpx;
		margin-bottom: 20rpx;
		box-shadow: 0 2rpx 6rpx rgba(0, 0, 0, 0.05);
	}

	.info {
		font-size: 28rpx;
		color: #333;
		display: flex;
		align-items: center;
	}

	.user-info {
		margin-left: 10rpx;
	}

	.avatar {
		width: 50rpx;
		height: 50rpx;
		border-radius: 50%;
	}

	.rating {
		font-size: 24rpx;
		color: #ff9800;
		margin-top: 5rpx;
		margin-left: 10rpx;
	}

	.content {
		font-size: 28rpx;
		color: #333;
		line-height: 1.5;
		margin-top: 15rpx;
	}

	.time {
		margin-top: 10rpx;
		font-size: 24rpx;
		color: #888;
	}
</style>